<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<base href="<%=basePath%>">
	<meta charset="utf-8" />
		<title>提箱场站</title>		
		
			<script type="text/javascript" src="plugins/websocketInstantMsg/ext4/ext-all-debug.js"></script>
<script type="text/javascript" src="static/js/jquery-1.7.2.js" />
			<script type="text/javascript" src="plugins/websocketInstantMsg/ext4/locale/ext-lang-zh_CN.js"></script>
			<link rel="stylesheet" href="plugins/websocketInstantMsg/ext4/resources/css/ext-all.css" />
			
			
</head>

<body class="no-skin">
		<base href="<%=basePath%>">
	<div class="main-container" id="main-container"style="overflow-x:scroll">
		<div class="main-content">
			<div class="main-content-inner">
				<div class="page-content">
					<div class="row">
						<div class="col-xs-12">
<!-- 						<form action="domesticRouteMaintain/list" method="post" name="transportClauseForm" id="transportClauseForm"> -->
<!--  							<fieldset> -->
<!--  								<table style="margin-top:5px;"class="table table-striped table-bordered table-hover"> -->
<!--  									<tr> -->
<!--  									<td style="width:79px;text-align: right;padding-top: 13px;">快速检索码：</td> -->
<%-- 										<td><input type="text" name="ROUTE_NAME" id="ROUTE_NAME" value="${pd.ROUTE_NAME }" maxlength="32" style="width:98%;"/></td> --%>
<!-- 										<td style="width:79px;text-align: right;padding-top: 13px;">场站名称：</td> -->
<%-- 										<td><input type="text" name="ROUTE_NAME" id="ROUTE_NAME" value="${pd.ROUTE_NAME }" maxlength="32" style="width:98%;"/></td> --%>
<!-- 										<td style="width:79px;text-align: right;padding-top: 13px;">是否可用：</td> -->
<!-- 										<td> -->
<!-- 											<select style="width:98%;"name="ENABLE"> -->
<!-- 											<option value=""></option> -->
<!-- 											  <option value="1">是</option> -->
<!-- 											  <option value="0">否</option> -->
<!-- 											</select> -->
<!-- 										</td> -->
										
										
<!--  									</tr> -->
<!--  								</table> -->
<!--  							</fieldset> -->
<!-- 						</form> -->
<!-- 								<div id="suitcaseStaion"></div> -->
									<div id="selForm"></div>
									<div id="find"></div>
<!-- 								<div style="height:79px"></div> -->
							<div id="gsmLacciDayList"></div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
var globsel = {FAST_SEARCH_CODE:'',STATION_NAME:'',ENABLE:''};
Ext.onReady(function(){
	Ext.QuickTips.init();
	var selModel = Ext.create('Ext.selection.CheckboxModel',{checkOnly:false});
	  var columns = [ 
					{text:'ID',dataIndex:'ID',hidden:true},
	                 {text:'快速检索码',dataIndex:'FAST_SEARCH_CODE'}, //sortable:true 可设置是否为该列进行排序  
	                 {text:'场站名称',dataIndex:'STATION_NAME'},  
	                 {text:'是否可用',dataIndex:'ENABLE'}, 
// 	                 {text:'修改',dataIndex:'',width : 90,align : 'center',renderer:function(){return  '<input id="edit"type="button" text="按钮">'}},
// 	                 {text:'删除',dataIndex:'',width : 90,align : 'center',renderer:function(){return  '<input id="delete"type="button" text="按钮">'}}
// 	                 {
// 	                     xtype:'actioncolumn',
// 	                     width:50,
// 	                     items: [{
// 	                         icon: 'extjs/examples/shared/icons/fam/cog_edit.png',  // Use a URL in the icon config
// 	                         tooltip: 'Edit',
// 	                         handler: function(grid, rowIndex, colIndex) {
// 	                             var rec = grid.getStore().getAt(rowIndex);
// 	                             alert("Edit " + rec.get('firstname'));
// 	                         }
// 	                     },{
// 	                         icon: 'extjs/examples/restful/images/delete.png',
// 	                         tooltip: 'Delete',
// 	                         handler: function(grid, rowIndex, colIndex) {
// 	                             var rec = grid.getStore().getAt(rowIndex);
// 	                             alert("Terminate " + rec.get('firstname'));
// 	                         }
// 	                     }]
// 	                 }
// 	                 {header:'修改',dataIndex:'edit'},
// 	                 {header:'删除',dataIndex:'delete'}
	               ]; 
// 		var clear = Ext.create('Ext.Button',{
// 	     	text: '删除',
// 	     	listeners: {
// 	         'click': function () {
// 	        	 Ext.getCmp('myform').getForm().reset();
// 	        }
// 	     }
// 	  });
	  Ext.define('store', {
			extend : 'Ext.data.Model',
			fields :[  
				   {
	   		name:'ID'
	   	},  {
	   	    name: 'FAST_SEARCH_CODE'
	   	},{
	   	    name : 'STATION_NAME'
	   	},{
	   	    name : 'ENABLE'
	   	}
				]
		});

	  var store = Ext.create('Ext.data.Store', {
			model : 'store',
			pageSize:10,
// 			pageSize : thePageSize,
			id:'store',
			proxy : {
				type : 'ajax',
				actionMethods : {
					read : 'POST'
				},//将提交方式改为post
				url : '<%=basePath%>SuitcaseStation/value',
				reader : {
					type : 'json',
					root : 'root',totalProperty:'total'
				}
			}
		});
	 store.load({ params:{start : 0,limit : 10}}); 
	  var paging = new Ext.PagingToolbar(
				{
					store : store,
					 pageSize:10,
					displayInfo : true,
					displayMsg : '<span style="color:blue;">第{0}条</span>至<span style="color:blue;">{1}条</span>，共<span style="color:blue;">{2}</span>条记录',
					emptyMsg : '无记录'
				});
		var tradeTypeStore = Ext.create('Ext.data.Store', {
			fields: ['id', 'name'],
			data : [
				{"id":"", "name":"请选择"},
				{"id":"1", "name":"是"},
				{"id":"0", "name":"否"}
			]
		});
		var edit =new Ext.Button({
			text: '修改',
	     	listeners: {
	         'click': function () {
	        	 var records = grid.getSelectionModel().getSelection();
	        	 if(records.length==0){
		       			Ext.Msg.alert("提示","请选择需要编辑的实体记录");return;
		       		}
		       		if(records.length>1){
		       			Ext.Msg.alert("提示","只能编辑一条实体记录");return;
		       		}
		       		var needful = {
	       					xtype: 'fieldset',
	       					title: '必填信息',
	       					layout: 'vbox',
	       					//collapsible: true,
	       					//collapsed: false,
	       					margin: 2,
	       					padding:0,
	       					items: [
	       					        	{
	       					        		xtype: 'textfield',
	       					        		name: 'ID',
	       					        		hidden: true, 
	       					        		hideLabel:true,
	       					        		fieldLabel: 'ID',
	       					        		value:records[0].data.ID,
	       					        		allowBlank:false
	       					        	},{
	       					        		xtype: 'textfield',
	       					        		name: 'STATION_NAME',
	       					        		fieldLabel: '场站名称',
	       					        		value:records[0].data.STATION_NAME,
	       					        		allowBlank:false
	       					        	},{
	       					        		xtype: 'textfield',
	       					        		name: 'FAST_SEARCH_CODE',
	       					        		fieldLabel: '快速检索码',
	       					        		value:records[0].data.FAST_SEARCH_CODE,
	       					        		allowBlank:false
	       					        	},{
	       					        		xtype:'combo',
	       					        		store:{
	       					        			fields:['use_flag','use_display'],
	       					        			data:[{use_flag:'1',use_display:'是'},{use_flag:'0',use_display:'否'}]
	       					        		},
	       					        		valueField:'use_flag',
	       					        		displayField:'use_display',
	       					        		allowBlank:false,
	       					        		name:'useFlag',
	       					        		fieldLabel:'是否可用',
	       					        		editable:false,
	       					        		value:records[0].data.ENABLE
	       					        	}
	       					        ]
	       			};
		       		var win = Ext.create("Ext.window.Window", {
		 				title: "编辑",
		 				modal:true,
		 				/*width: 800,
		 				height: 360,*/
		 				maximizable: true,
		 				closeAction:'destroy',
		 				layout: "fit",
//		  				margin: '3 3 0',
		 		        buttonAlign:'center',
		 				items: [
		 				        	{
		 				        		xtype: "form",
		 				        		id:'form',
		 				        		bodyPadding: 5,
		 				        		layout: "hbox",
		 				        		defaults: {
		 				        			border: true,
		 				        			flex: 1,
		 				        			anchor: '100%'
		 				        		},
		 				        		fieldDefaults: {
		 				        			labelWidth: 92,
		 				        			labelAlign: "right",
		 				        			//flex: 1,
		 				        			margin: 5,
		 				        			labelStyle: 'color:green;'
		 				        		},
		 				        		items: [needful]
		 				        	}
		 				        ],
		 				       buttons: [{
     		       		            text: '保存',
     		       		            handler: function(){
     		       		            	var form = Ext.getCmp('form').getForm();
     		       		            	alert(form)
     		       		               if(form.isValid()){
     		       		            	   alert("1");
     		       		            	form.submit({
     		       		            		params:{
     		       		            		STATION_NAME:encodeURI(form.findField('STATION_NAME').value),
     		       		            		FAST_SEARCH_CODE:encodeURI(form.findField('FAST_SEARCH_CODE').value),
     		       		            		ENABLE:form.findField('useFlag').value,
     		       		            		ID:encodeURI(form.findField('ID').value),
     		       		            			
     		       		            		},
     		       		            		waitTitle : '请稍后...',  
     		       		            		waitMsg : '正在保存信息,请稍后...',  
     		       		            		url:'<%=basePath%>SuitcaseStation/saveOrUpdateSuitcaseStationInfo',
					          				success:function(form,action){
					          					Ext.Msg.alert("提示","保存成功");
					          					store.load();
					          					win.close();
					          				},

					          			});
     		       		                }
     		       		            }
     		       		        },{
     		       		            text: '关闭',
     		       		            handler: function(){
     		       		            	win.close();
     		       		            }
     		       		        }]
		 			});
		       		win.show();
	        }
	     }
		});
		var deleteInfo =new Ext.Button({
			text: '删除',
			handler:function(){
	     		var records = grid.getSelectionModel().getSelection();
	       			if(records.length==0){
	       				Ext.Msg.alert("提示","请选中需要删除的实体记录");return;
	       			}
	       			var arr = [];
	       			Ext.each(records,function(item){
	       				obj = {
	       						id:item.data.ID
	       				};
	       				arr.push(obj);
	       			});
	       			var array = JSON.stringify(arr);
	       			Ext.Msg.confirm("提示","确定删除数据?",function(btn){
		       				
		       					Ext.Ajax.request({
		       						url:'<%=basePath%>SuitcaseStation/deleteSuitcaseStationInfo',
		       						params:{
		       							array:array
		       						},
		       						timeout:5000,
		       						success:function(response){
		       							store.load();
		       							Ext.Msg.alert("成功","删除成功!");
		       						},
		       						failure:function(response){
		       							Ext.Msg.alert("错误","请求异常!");
		       						}
		       					});
		       				
		       			});
	     	}
		});
	  var c1 = Ext.create('Ext.container.Container', {
			layout: 'column',
			defaults: { labelAlign: 'left', labelWidth: 60 },
			items: [
				{id:"startDate1",xtype: 'textfield', name: 'startDate1',columnWidth: 1/5,padding: '5px',fieldLabel: '快速检索码'},
				{id:"startDate2",xtype: 'textfield', name: 'startDate2', columnWidth:  1/5,padding: '5px', fieldLabel: '场站名称'},
				{id:"startDate11",xtype: 'combobox',  name: 'startDate11',value:'',editable: false,displayField: 'name', queryMode: 'local',store:tradeTypeStore,valueField: 'id', columnWidth:  1/5,padding: '5px', fieldLabel: '是否可用'}

			]
		});
	 
	  var bs = Ext.create('Ext.container.Container', {
			layout: 'column',
			items: [
				{layout : 'column',baseCls : 'my-panel-no-border', columnWidth: 2/5,   padding: '10px'},
				{layout : 'column',baseCls : 'my-panel-no-border',columnWidth: 1/5,  padding: '10px',  items: [
					{ style: {marginRight:'10px'}, xtype: "button",minWidth:70,icon:'../plugins/websocketInstantMsg/ext4/shared/icons/fam/add.png', text: "添加",handler: function(){
			      		 var FAST_SEARCH_CODE = Ext.getCmp('startDate1').getValue();
				      		var STATION_NAME = Ext.getCmp('startDate2').getValue();
				      		var ENABLE = Ext.getCmp('startDate11').getValue();

				      		var ID = "";
				      		 Ext.Ajax.request({
				       			 url: '<%=basePath%>SuitcaseStation/saveOrUpdateSuitcaseStationInfo',
				        			 params:{ID:ID,FAST_SEARCH_CODE:FAST_SEARCH_CODE,STATION_NAME:STATION_NAME,ENABLE:ENABLE},
				        			 method: 'POST',
				        			success: function () {
				                       Ext.MessageBox.alert("保存成功","保存成功");
				                       var grid = Ext.getCmp('contractInfo');
				                       store.load();  
				                   },
				        		 });
				      	 } },
				],},
				{layout : 'column',baseCls : 'my-panel-no-border', columnWidth: 2/5,  padding: '10px'}
			]
		});
	  var c2 = Ext.create('Ext.container.Container', {
			layout: 'column',
			defaults: { labelAlign: 'left', labelWidth: 60 },
			items: [
				
				{id:"startDate3",xtype: 'textfield', name: 'startDate3', columnWidth:  1/5,padding: '5px', fieldLabel: '场站名称'},
				{id:"startDate4",xtype: 'textfield', name: 'startDate4',columnWidth: 1/5,padding: '5px',fieldLabel: '检索码'},

			]
		});
	  var bs2 = Ext.create('Ext.container.Container', {
			layout: 'column',
			items: [
				{layout : 'column',baseCls : 'my-panel-no-border', columnWidth: 2/5,   padding: '10px'},
				{layout : 'column',baseCls : 'my-panel-no-border',columnWidth: 1/5,  padding: '10px',  items: [
					{ style: {marginRight:'10px'}, xtype: "button",minWidth:70,icon:'../plugins/websocketInstantMsg/ext4/shared/icons/fam/add.png', text: "查询",handler: function(){
			      		 var FAST_SEARCH_CODE = Ext.getCmp('startDate4').getValue();
				      		var STATION_NAME = Ext.getCmp('startDate3').getValue();
					var store = Ext.getCmp('grid').getStore();
				　　store.on('beforeload', function(store,options) {  
				            var new_params = {  
				            		FAST_SEARCH_CODE : FAST_SEARCH_CODE, STATION_NAME:STATION_NAME
				            };  
				　　//这里apply一下实现新的proxy  
				            Ext.apply(store.proxy.extraParams,new_params);  
				        });  
				　　//对store重新载入  
				        store.load();  


							
				      	 } },
				],},
				{layout : 'column',baseCls : 'my-panel-no-border', columnWidth: 2/5,  padding: '10px'}
			]
		});
	  var selForm = Ext.create('Ext.form.Panel', {
			title:'提箱场站',
			name: 'selForm',
			renderTo: "selForm",
			width:'100%',
// 			collapsed :true,
			height:140,
// 			collapsible:true,
			bodyStyle: {
				padding: '5px',
				border: 1
			},
			fieldDefaults: {
				labelAlign: 'left'
			},
			items: [c1,bs]
		});
	  
	  var selForm1 = Ext.create('Ext.form.Panel', {
			
			name: 'find',
			renderTo: "find",
// 			collapsed :true,
			height:70,
// 			collapsible:true,
// 			bodyStyle: {
// 				padding: '5px',
// 				border: 1
// 			},
// 			fieldDefaults: {
// 				labelAlign: 'left'
// 			},
			items: [c2,bs2]
		});
		var grid = new Ext.grid.GridPanel({
			//collapsible :true,
		    //split: true,
		    width:'100%',
		    store:store,
		    forceFit:true,
		    columns:columns,
		    id:'grid',
		    selModel:selModel,
		    columnLines: true,
		    menuDisabled:true,
		     bbar : paging,
		     tbar: [edit,deleteInfo],
		    viewConfig:{enableTextSelection:true,stripeRows: true},
		    renderTo:'gsmLacciDayList',
		});
		
// 		grid.getStore().reload();
	});
// $("edit").click(function(){
// 	  alert("1");
// 	});
</script>
</html>